<template>
	<view v-if="pageShow">
		<view class="content"></view>
		<view class="mainpadding_top">
			<view class="mainpadding_top radius" style="background-color: #ffa126;">
				<view class="xiaobai textcenter">
					{{dataAll.schoolinfo.title}}{{dataAll.schoolinfo.school.name}}{{dataAll.schoolinfo.school_xy.name}}{{dataAll.schoolinfo.school_xy_zy.name}}{{dataAll.schoolinfo.school_xy_zy_fx.name}}
				</view>
			</view>
			<view class="flexcenter">
				<view class="xiaohong margin_top" v-if="dataAll.schoolinfo.school.whchat_code"
					@click="copy(dataAll.schoolinfo.school.whchat_code)">
					点击复制讨论QQ群：{{dataAll.schoolinfo.school.whchat_code}}</view>
			</view>
			<view class="flexleft flexcenter margin_top6">
				<view class="all" :class="type==1?'gongying':'xuqui'" @click="changetype(1)">专业</view>
				<view class="alls" :class="type==2?'gongying':'xuqui'" @click="changetype(2)">方向</view>
			</view>
			<view class="flexcenter fonweight margin_top6 baixian" style="font-size: 50rpx;color: #33d5a6;">初试分数排名统计
			</view>
			<view class="flexbetween margin_top6 mainpadding">
				<u-icon name="play-left-fill" color="#ffa126" size="20" @click="up"></u-icon>
				<view class="flexcenter fonweight  baixian" style="font-size: 30rpx;color: #ffa126;">
					您当前的排名是：{{dataAll.curr_rank.curr_rank_num}}/{{dataAll.curr_rank.total_rank_num}}</view>
				<u-icon name="play-right-fill" color="#ffa126" size="20" @click="next"></u-icon>
			</view>
			<view class="xiaohei fonweight strongtext"></view>
			<view class="margin_top6">
				<uni-table border stripe emptyText="暂无更多数据">
					<!-- 表头行 -->
					<uni-tr style="background-color: #ffa126;color: #fff;">
						<uni-th align="center" style="color: #fff;" width="30">排名</uni-th>
						<uni-th align="center" style="color: #fff;" width="30">姓名</uni-th>
						<uni-th align="center" style="color: #fff;" width="30">总分</uni-th>
						<uni-th align="center" style="color: #fff;" width="30"
							v-for="(item,index) in dataAll.km_num">科目{{index+1}}</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr v-for="(item,index) in list.data" :key="item.id">
						<uni-td align="center">{{item.rank}}</uni-td>
						<uni-td align="center">{{item.username}}</uni-td>
						<uni-td align="center">{{item.total_score}}</uni-td>
						<uni-td align="center" v-for="(ite) in item.cjcontent_text"
							:key="ite.school_xy_zy_fx_xk_id">{{ite.score}}</uni-td>
					</uni-tr>
				</uni-table>
			</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				zkzno: "",
				type: 1, //1专业，2方向
				page: 1,
				limit: 8,
				list: {
					data: []
				},
				dataAll: {},
				pageShow: false
			}
		},
		onLoad(options) {
			this.zkzno = options.number
			this.init()
		},
		methods: {
			up() {
				let page = this.page;
				if (page == 1) {
					return false;
				}
				page--;
				this.init(page)
			},
			next() {
				let page = this.page;
				if (this.list.last_page <= page) {
					return false;
				}
				page++;
				this.page = page
				this.init(page)
			},
			init(page) {
				uni.showLoading({
					mask: true,
					title: "请稍后",
				})
				let _this = this
				httpRequest.request('/api/schoolcl/getScoreIndex', 'GET', {
					page: page || 1,
					limit: _this.limit,
					zkzno: this.zkzno,
					type: this.type
				}).then(res => {
					uni.hideLoading()
					if (res.code == 1) {
						let resList = res.data.list;
						_this.list.data = resList.data;
						this.dataAll = res.data
						this.pageShow = true
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},

			changetype(val) {
				if (this.type == val) {
					return false
				}
				this.type = val
				this.page = 1
				this.init()
			}

		}
	}
</script>

<style>
	.xuqui {
		background: #fff;
		color: #33d5a6;
		border: 2rpx solid #33d5a6;
	}

	.gongying {
		background: #33d5a6;
		color: #ffff;
		border: 2rpx solid #33d5a6;
	}

	.all {
		border-radius: 11rpx 0rpx 0rpx 11rpx;
		font-size: 31rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		padding: 11rpx 38rpx;
		border: 2rpx solid #33d5a6;
	}

	.alls {
		border-radius: 0rpx 11rpx 11rpx 0rpx;
		font-size: 32rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		padding: 11rpx 38rpx;
		border: 2rpx solid #33d5a6;
	}

	.baixian {
		text-shadow: -3px 0 rgba(255, 255, 255, 1), 0 3px rgba(255, 255, 255, 1), 3px 0 rgba(255, 255, 255, 1), 0 -3px rgba(255, 255, 255, 1);
	}

	.iteminput {
		padding: 15rpx 30rpx;
		border: 5rpx solid #33d5a6;
		border-radius: 50rpx;
	}

	.content {
		background-image: url("@/static/image/bg3.jpg");
		width: 100%;
		height: 100%;
		position: fixed;
		background-size: 100% 100%;
		z-index: -1;
	}

	.paihangbang {
		font-size: 40rpx;
		text-align: center;
		font-weight: bold;
		color: #ffa126;
		text-shadow: -3px 0 rgba(255, 255, 255, 1), 0 3px rgba(255, 255, 255, 1), 3px 0 rgba(255, 255, 255, 1), 0 -3px rgba(255, 255, 255, 1);
	}

	.posi1 {
		position: absolute;
		right: -120rpx;
		width: 400rpx;
		height: 400rpx;
	}

	.posi2 {
		position: relative;
		right: 100rpx;
		width: 400rpx;
		height: 400rpx;
	}
</style>